<template>
	<div>
       <mycontent :persion="persionData"></mycontent>
	</div>

</template>

<script>
  import mycontent from "../../../real-components/myPersion";
  import Vue from 'vue'
  import {getUserInfo, signout, changeUserInfo, getUserInfoAgain} from '../../../api/wxh/getData.js'
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import axios from 'axios'
  import {Toast} from '../../../utils/toast.js'
  import {MessageBox} from "../../../ui-components"

  export default {
    data () {
      return {
      	persionData:{
	        imgUrl: null,//头像
	        account: null,//账号
	        username: null, //昵称
	        birthday: null,//生日
	        sex: null, //性别
	        sex_1: null,//
	        email: null,//家庭成员
	        flag: false,
	        flag_birthday: false,
	        flag_member: false,
	        image: false,
	        visiable: false,
	        date: new Date(),
	        showDatePicker: false,
	        slots: [
	          {
	            values: ['男', '女'],
	            textAlign: 'center',
	            cancelText: '取消'
	          }
	        ],
	        options: {
	          url: '/upload',
	          paramName: 'file',
	        },
	        page: "my",
	      }
     }
	},
    computed: {
      ...mapGetters('wxh', [
        'sessionId'
      ])
    },
    async mounted() {
      await this.getUserInfo();
      await this.initData();
      this.image = true;

    },
    components: {
      "mycontent": mycontent,
    }
    ,
	methods: {
	  ...mapActions('wxh', [
	    'getUserInfo'
	  ])
	  ,
	  ...mapMutations('wxh', [
	    'USER_INFO',
	    'ClEAR_SESSIONID',
	    'LOGO_OUT',
	    'LOGO_IN',
	    'CLEAR_INFO'
	  ])
	  ,
	  onValuesChange(picker, values) {
	    this.sex_1 = values[0];
	  }
	  ,
	  changeDate(date) {
	    date= date.split("-")
	    return new Date(date[0],date[1]-1, date[2])
	  },
	cancel () {
	    this.showDatePicker = false
	},
    handleChange(value) {
        this.showDatePicker = false
        let val = String(value).substr(4, 12);
        let year = val.substr(6, 8);
        let month = val.substr(0, 3);
        let day = val.substr(3, 4);

        switch (month) {
          case 'Jan':
            month = '0' + 1;
            break
          case 'Feb':
            month = '0' + 2;
            break
          case 'Mar':
            month = '0' + 3;
            break
          case 'Apr':
            month = '0' + 4;
            break
          case 'May':
            month = '0' + 5;
            break
          case 'Jun':
            month = '0' + 6;
            break
          case 'Jul':
            month = '0' + 7;
            break
          case 'Aug':
            month = '0' + 8;
            break
          case 'Sep':
            month = '0' + 9;
            break
          case 'Oct':
            month = 10;
            break
          case 'Nov':
            month = 11;
            break
          case 'Dec':
            month = 12;
            break
        }
        this.birthday = year.substr(0, 5) + '-' + month + '-' + day.substr(1, 3)
        let sendDate = year.substr(0, 5) + '-' + month + '-' + day.substr(1, 3);

        changeUserInfo({
          birthday: sendDate
        });
        this.flag_birthday = !this.flag_birthday;
    }
    ,

      async initData() {
      	// this.sessionId = 'f38530fc93ec46dda736a5266525b145';
        let response = await getUserInfoAgain(this.sessionId);

        if (response.returncode === 0) {
          Toast({
            message: response.errmsg,
            iconClass: "aui-iconfont aui-icon-close",
            duration: 2000
          })
          this.LOGO_OUT(false);
          return
        }

        this.LOGO_IN(true);
        this.USER_INFO(response.data[0]);


        let res = await getUserInfoAgain(this.sessionId);
        if (res.returncode === 0) {
          //获取信息失败
          Toast({
            message: res.errmsg,
            iconClass: "aui-iconfont aui-icon-close",
            duration: 2000
          });
          return
        }

        if (res.data == '') {
          Toast({
            message: "暂无信息",
            iconClass: "aui-iconfont aui-icon-close",
            duration: 2000
          });
          return
        }

        this.imgUrl = res.data[0].vipheadphoto //头像
        this.account = res.data[0].phone //昵称
        this.username = res.data[0].vipname
        this.birthday = res.data[0].birthday;
        this.email = res.data[0].email;
        this.sex = res.data[0].sex ? res.data[0].sex : this.sex;
      }
      ,
      changeUserInfo(val) {
        switch (val) {
          case "username":
            MessageBox.prompt(this.username, '昵称').then(param => {
              this.username = param.value;
              changeUserInfo({
                vipname: this.username
              });
            });
            break;
          case "sex":
            // this.flag = true;
            this.sex_1 = this.sex_1 == "男" ? "男" : "女"
            changeUserInfo({
              sex: this.sex_1 == '男' ? 0 : 1
            });
            this.sex = this.sex_1;
            break;
          case "birthday":
            this.showDatePicker=true
            setTimeout( () => {
              this.$refs.picker.open();
            },20)

            this.flag_birthday = !this.flag_birthday;
            // this.visiable = !this.visiable;
            changeUserInfo({
              birthday: this.birthday
            });
            break;
          case "email":
            MessageBox.prompt(this.email, '邮箱').then(param => {
              var isParst = this.checkMail(param.value)
              if (isParst) {
                this.email = param.value;
                changeUserInfo({
                  email: this.email
                });
              } else {
                Toast({
                  message: "E-Mail地址错误",
                  iconClass: "aui-iconfont aui-icon-close",
                  duration: 2000
                })
              }

            });
            break;
        }
      }
      ,
      async sending (file, xhr, formData) {
        let date = new Date().getTime();
        formData.append("file", file.name);
        formData.append("name", "file");
        formData.append('Content-Type', file.type);
        let config = {
          url: window.api.mall_file_host + '/upload?token=' + date,
          method: 'post',
          data: formData
        }
        axios(config).then(res => {
          if (res.code == 200) {
            Toast({
              message: "头像修改成功",
              iconClass: "aui-iconfont aui-icon-correct",
              duration: 2000
            });
          }
          changeUserInfo({
            vipheadphoto: res.data.visitPath
          });
        });
      },
      //邮箱校验
      checkMail (mail) {
        var isParst = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(mail)
        return isParst
      }
    },
}
</script>

